/**
* 功能描述：级联选择器样式
* @author jin xiaohang
* @date 2022/9/29 11:16
* @version 1.0
*/

@import "src/style/mixins/index";


//定义布局
@mixin cascader-panel-layout{
  width: 100%;
  height: 100%;
  max-width: 333px;
  max-height: 180px;

  //待选面板
  .#{$namespace}-cascader-panel-menu{
    display: inline-block;
    min-width: 111px;
    height: 180px;
    padding: 4px 0;
    overflow: auto;
    vertical-align: top;

    //待选面板项
    .#{$namespace}-cascader-panel-menu-item{
      position: relative;
      padding: 5px 12px;
      line-height: 22px;
      white-space: nowrap;
      &:hover{
        background-color: #E6F7FF;
        cursor: pointer;
      }

      //面板项符号
      .#{$namespace}-cascader-panel-menu-item-icon{
        position: absolute;
        right: 12px;
      }
    }
  }
}

//定义样式
@include b(cascader-panel){
  font-size: 14px;
  background: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 8px #00000026;

  //待选面板
  .#{$namespace}-cascader-panel-menu{
    border-right: 1px solid #f0f0f0;

    //待选面板项
    .#{$namespace}-cascader-panel-menu-item{
      cursor: pointer;
      transition: all .3s;
      &:hover{
        background-color: #E6F7FF;
        cursor: pointer;
      }

      //面板项符号
      .#{$namespace}-cascader-panel-menu-item-icon{
        font-size: 12px;
        transform: scale(.83333333) rotate(0);
        color: #00000073;
      }
    }
  }

  //引用布局
  @include cascader-panel-layout;

}